$(document).ready(function () {
	AOS.init()
	$('.add-btn').click(function () {
		$('#joinModal').show()
	});
	const prov = $('.select-all #prov');
	const city = $('.select-all #city');
	const country = $('.select-all #country');
	let current = {
		prov: '',
		city: '',
		country: ''
	}
	$.ajax({
		url: 'http://tmtx.test.dgyunju.cn/api/area',
		type: 'get',
		data: { lang: 'zh-cn' },
		dataType: 'json',
		success: function (res) {
			console.log(1);
			const list = res.data
			list.forEach((i, v) => {
				let provOpt = document.createElement('option');
				provOpt.innerText = i.name;
				provOpt.value = i.name
				prov.append(provOpt);
			})
			prov.on("change", function () {
				$('.select-all #city option').remove()
				let textA = prov.val()
				list.forEach(i => {
					if (i.name === textA) {
						i.children.forEach(i2 => {
							let provOpt = document.createElement('option');
							provOpt.innerText = i2.name;
							provOpt.value = i2.name
							city.append(provOpt)
						})
					}
				})
			});
		},
	})
	// 表单数据
	const formState = {
		company: '',
		phone: '',
		tel: '',
		wechat: '',
		email: '',
		qq: '',
		address: '',
		name: ''
	};

	// 验证规则
	const rules = {
		name: {
			required: true,
			message: '请输入姓名',
			trigger: 'blur'
		},
		company: {
			required: true,
			message: '请输入公司/学校',
			trigger: 'blur'
		},
		phone: {
			required: true,
			pattern: /^1[3-9]\d{9}$/,
			message: '请输入正确的手机号码',
			trigger: 'blur'
		},
		email: {
			pattern: /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/,
			message: '请输入正确的邮箱地址',
			trigger: 'blur'
		},
		address: {
			required: true,
			message: '请选择所在地区',
			trigger: 'change'
		}
	};

	// 表单验证
	function validateForm () {
		let isValid = true;

		$('#applyForm .form-row').each(function () {
			const field = $(this).data('field');
			const $input = $(this).find('.el-input__inner');
			const $error = $(this).find('.error-message');
			const value = $input.val().trim();

			$error.text('');

			if (rules[field] && rules[field].required && !value) {
				$error.text(rules[field].message);
				isValid = false;
				return false;
			}

			if (rules[field] && rules[field].pattern && value && !rules[field].pattern.test(value)) {
				$error.text(rules[field].message);
				isValid = false;
				return false;
			}

			// 微信和QQ至少填一个
			if (field === 'wechat' || field === 'qq') {
				if (!$('#applyForm [data-field="wechat"] .el-input__inner').val().trim() &&
					!$('#applyForm [data-field="qq"] .el-input__inner').val().trim()) {
					$('#applyForm [data-field="wechat"] .error-message, #applyForm [data-field="qq"] .error-message')
						.text('微信号与QQ必须填一个');
					isValid = false;
					return false;
				}
			}
		});

		return isValid;
	}

	// 提交表单
	$('#submitBtn').click(function () {
		if (!validateForm()) {
			return;
		}

		// 收集表单数据
		$('#applyForm .form-row').each(function () {
			const field = $(this).data('field');
			formState[field] = $(this).find('.el-input__inner').val().trim();
		});

		// 模拟提交
		$(this).prop('disabled', true).find('span').text('提交中...');

		alert('报名成功！');
		$('#submitBtn').prop('disabled', false).find('span').text('确认报名');
		$('#joinModal').hide();
	});

	// 关闭弹窗
	$('#joinModal').click(function (e) {
		if ($(e.target).closest('.modal-container').length === 0) {
			$(this).hide();
		}
	});
});